import React, { Component } from 'react'
import { useNavigate } from 'react-router-dom'

const NewsItem = (props) => {
  const { newsList } = props
  const navigate = useNavigate()
  return (
    <ul>
      {newsList.map((item) => {
        return (
          <li
            key={item.id}
            onClick={() => {
              navigate(`/detail/${item.id}`, { state: {}, replace: true })
            }}
          >
            <img src={item.img} alt="" />
            {item.content}
          </li>
        )
      })}
    </ul>
  )
}

export default NewsItem
